{% extends "前端/template.html" %}

{% block title %}
简单翻译-我想说
{% endblock %}

{% block css %}
<style>
.feature-card {
    padding: 1.5rem;
    border-radius: 0.5rem;
    background: #fff;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
    margin-bottom: 1.5rem;
    transition: transform 0.2s;
}

.feature-card:hover {
    transform: translateY(-5px);
}

.feature-icon {
    font-size: 2rem;
    color: #696cff;
    margin-bottom: 1rem;
}

.feature-title {
    font-size: 1.25rem;
    margin-bottom: 0.75rem;
    color: #566a7f;
}

.feature-text {
    color: #697a8d;
    line-height: 1.5;
}
</style>
{% endblock %}

{% block content %}
<div class="row">
    <div class="col-12 mb-4">
        <div class="card">
            <div class="card-body">
                <h4 class="card-title mb-4">欢迎使用简单翻译</h4>
                <p class="card-text">
                    简单翻译是简单科技旗下专注于提供高质量翻译服务的产品。我们致力于为用户提供准确、流畅的翻译体验。
                </p>
            </div>
        </div>
    </div>
</div>

<div class="row">
    <div class="col-md-4">
        <div class="feature-card">
            <i class='bx bx-transfer feature-icon'></i>
            <h5 class="feature-title">智能翻译引擎</h5>
            <p class="feature-text">
                采用先进的AI翻译技术，支持多种语言之间的互译，确保翻译结果的准确性和自然度。
            </p>
        </div>
    </div>
    
    <div class="col-md-4">
        <div class="feature-card">
            <i class='bx bx-infinite feature-icon'></i>
            <h5 class="feature-title">无限制使用</h5>
            <p class="feature-text">
                不限次数、不限字数，让您可以专注于内容创作，无需担心使用限制。
            </p>
        </div>
    </div>
    
    <div class="col-md-4">
        <div class="feature-card">
            <i class='bx bx-bulb feature-icon'></i>
            <h5 class="feature-title">智能优化</h5>
            <p class="feature-text">
                根据上下文智能调整翻译结果，提供更符合场景的翻译建议。
            </p>
        </div>
    </div>
</div>

<div class="row mt-4">
    <div class="col-12">
        <div class="card">
            <div class="card-body">
                <h5 class="card-title">为什么选择我们？</h5>
                <ul class="list-unstyled mt-3">
                    <li class="mb-2"><i class='bx bx-check text-primary me-2'></i>专业的翻译质量</li>
                    <li class="mb-2"><i class='bx bx-check text-primary me-2'></i>简单易用的界面</li>
                    <li class="mb-2"><i class='bx bx-check text-primary me-2'></i>快速的响应速度</li>
                    <li class="mb-2"><i class='bx bx-check text-primary me-2'></i>完善的服务支持</li>
                </ul>
            </div>
        </div>
    </div>
</div>
{% endblock %}

{% block js %}
{% endblock %}

{% block nav_left %}
{% include "前端/components/左侧导航栏.html" %}
{% endblock %}

{% block NavBar %}
{% include "前端/components/搜索框、个人头像.html" %}
{% endblock %}

{% block footer %}
{% include "前端/components/Footer.html" %}
{% endblock %}